// 点击协议的复选框后选中注册按钮亮起 否则暗淡
// 获取复选框
let check = document.querySelector('.agreen .check')
// 获取注册按钮
let go = document.querySelector('.go')



check.addEventListener('click', function () {
    // console.log(check.checked);
    if (check.checked === true) {
        go.style.backgroundColor = '#00bdff'
        go.style.color = '#fff'
    } else {
        go.style.backgroundColor = '#e0e0e0'
        go.style.color = '#666'
    }
})


// 在输入框内输入内容判断是否有内容如果有内容则显示删除按钮，没有则隐藏
// 获取输入框
let input = document.querySelectorAll('.input')
// 获取删除按钮
let clear = document.querySelectorAll('#clear')
// console.log(clear, input);
// 遍历
input.forEach(function (dom, index) {
    // input判断输入框改变时的事件
    dom.addEventListener('input', function () {
        if (dom.value.length > 0) {
            clear[index].style.display = 'block'
        } else {
            clear[index].style.display = 'none'
        }
        // console.log(dom.value.length);
    })
})
// 点击删除按钮时清空输入框并隐藏自身
clear.forEach(function (dom, index) {
    dom.addEventListener('click', function () {
        input[index].value = ''
        dom.style.display = 'none'
    })

})
// 定义正则
// 点击获取验证码 获取一个4位数字的验证码
let get = document.querySelector('.get')
// console.log(get);
// 定义一个数值保存验证码
let code = '777777777777777777777777'
get.addEventListener('click', function () {
    code = ''
    for (let i = 0; i < 4; i++) {
        code += Math.floor(Math.random() * (10))
    }
    alert(code)
})
let reg = [
    /^[a-zA-Z][a-zA-Z0-9_]{5,11}$/,
    /^(13[0-9]|14[01456879]|15[0-3,5-9]|16[2567]|17[0-8]|18[0-9]|19[0-3,5-9])\d{8}$/,
    /^\d{4}$/,
    /^[a-zA-Z][a-zA-Z0-9_]{5,11}$/
]

// 失焦时进行判断如果不正确就显示提示
// 获取提示框
let tip = document.querySelectorAll('.tip')
input.forEach(function (dom, index) {
    dom.addEventListener('blur', function () {
        if (!reg[index].test(dom.value)) {
            tip[index].style.display = 'block'
        } else {
            // console.log(2);
            tip[index].style.display = 'none'
        }

    })
    input[2].addEventListener('blur', function () {
        if (input[2].value.length == 4 && input[2].value !== code) {
            // console.log(1);
            tip[2].innerHTML = `
            <span class="img"></span><span class="fl">验证码不正确</span>
            `
            tip[2].style.display = 'block'
        } else {
            // tip[2].style.display = 'none'
            tip[2].innerHTML = `
            <span class="img"></span><span class="fl">请输入4位手机验证码</span>
            `

        }
    })
})
// 点击注册时判断是否输入正确
// 获取注册按钮

go.addEventListener('click', function () {
    for (let i = 0; i < input.length; i++) {
        if (!check.checked) {
            return;
        } else if (!reg[i].test(input[i].value)) {
            tip[i].style.display = 'block'
            return;
        } else if (i == 2 && input[2].value.length == 4 && input[2].value !== code) {
            // console.log(1);
            tip[2].innerHTML = `
        <span class="img"></span><span class="fl">验证码不正确</span>
        `
            tip[2].style.display = 'block'
            return;
        } else if (i == 2 && input[2].value.length !== 4) {
            tip[2].innerHTML = `
        <span class="img"></span><span class="fl">请输入4位手机验证码</span>
        `
            return
        } else if (i == input.length - 1) {
            location.href = './home.html'
        }

    }

})